<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <!-- Required meta tags -->
    <title>悟空掌柜官网</title>
    <!--<meta charset="utf-8">-->
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport">
    <meta name="keywords" content="悟空掌柜官网" />
    <meta name="description" content="悟空掌柜官网" />
    <!--<link type="image/x-icon" href="images/favicon.ico" rel="shortcut icon">
     Bootstrap CSS -->
    <link rel="stylesheet" href="css/bootstrap.min.css?v=1572311855">
    <link rel="stylesheet" href="css/animate.min.css?v=1572311855">
    <link rel="stylesheet" href="css/main.css?v=1572311855">

    <link rel="stylesheet" href="css/swiper.min.css?v=1572311855">
    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="js/jquery.min.js"></script>
    <script src="js/popper.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/anime.min.js"></script>


    <script src="js/swiper.min.js?v=1572311855"></script>

    
<link rel="stylesheet" href="css/index.css?v=1572311855">

</head>

<body>
    
    <%- include('headfoot/header.html') %>
    <div class="masker"></div>
 <script>
	 $('.navbar-nav li').eq(0).addClass('active').siblings().removeClass('active');
 </script>   

    
<!-- 主要内容 开始 -->
<div class="swiper-container pc">
    <div class="swiper-wrapper">
                    <div class="swiper-slide">
                                    <img src="images/<%= index[0].banner%>" alt="" class="img-responsive" >
                            </div>
            </div>
    <div class="swiper-pagination"></div>
</div>
<div class="swiper-container web">
    <div class="swiper-wrapper">
                    <div class="swiper-slide">
                                    <img src="images/<%= index[0].banner%>" alt="" class="img-responsive">
                            </div>
            </div>
    <div class="swiper-pagination"></div>
</div>
<div class="container">
    <div class="about">
        <img class="about-img" src="images/<%= index[0].about.about_img %>">
        <div class="about-desc">
            <h3 class="desc-title"><%= index[0].about.about_title %></h3>
            <p class="desc-p"><%= index[0].about.about_intro %></p>
            <p class="desc-p2">
                <%= index[0].about.about_cnt %>
            </p>
        </div>
    </div>
    <div class="service">
        <div class="service-title">为你服务</div>
        <div class="service-content clearfix">
			<% index[0].sever.forEach(function(v){%>
            <div class="item fl mr28">
                <div class="item-img">
                    <img src="images/<%= v.sever_img%>" alt="">
                </div>
                <div class="item-desc">
                    <h3 class="desc-h3"><%= v.sever_title%></h3>
                    <p class="desc-p"><%= v.sever_intro%></p>
                    <div class="desc-btn"><a href="<%= v.sever_href%>" class="btn1">查看详情</a></div>
                </div>
            </div>
			<% }) %>
            <!-- <div class="item fl mr28">
                <div class="item-img">
                    <img src="images/ser_center.png" alt="">
                </div>
                <div class="item-desc">
                    <h3 class="desc-h3">小店创业者</h3>
                    <p class="desc-p">悟空掌柜以个人创业者能够获得踏实、阳光的收入为出发点，8大核心服务全面支持，让悟空小店创业者的时间更有价值。 </p>
                    <div class="desc-btn"><a href="shopService" class="btn1">查看详情</a></div>
                </div>
            </div>
            <div class="item fl">
                <div class="item-img">
                    <img src="images/ser_right.png" alt="">
                </div>
                <div class="item-desc">
                    <h3 class="desc-h3">悟空供应商</h3>
                    <p class="desc-p">悟空掌柜的小伙伴们会持续提升供应商服务水平及标准，力争实现“因需定产、快速周转”的使命，不断为供应商赋能。 </p>
                    <div class="desc-btn"><a href="supplierService" class="btn1">查看详情</a></div>
                </div>
            </div> -->
        </div>
    </div>
	
    <div class="ser">
		<% index[0].sever.forEach(function(v){%>
        <div class="ser-item mb40">
            <p class="title"><%= v.sever_title%></p>
            <p class="desc"><%= v.sever_intro%></p>
        </div>
		<% }) %>
       <!-- <div class="ser-item mb40">
            <p class="title">小店创业者</p>
            <p class="desc">悟空掌柜以个人创业者能够获得踏实、阳光的收入为出发点，8大核心服务全面支持，让悟空小店创业者的时间更有价值。 </p>
        </div>
        <div class="ser-item">
            <p class="title">悟空供应商</p>
            <p class="desc">悟空掌柜的小伙伴们会持续提升供应商服务水平及标准，力争实现“因需定产、快速周转”的使命，不断为供应商赋能。 </p>
        </div> -->
        <img src="images/<%= index[0].sever[0].sever_img%>" alt="">
    </div>
</div>
<div style="width: 100%;background: #F9F8F7" class="main">
    <div class="swiper" style="background-image: url(images/swiper_bg.png)">
        <div class="container">
            <div class="swiper-top">
                <h3><%= index[0].department.name%></h3>
                <p><%- index[0].department.intro%></p>
            </div>

            <!-- Swiper -->
            <div class="swiper-list">
                <div class="swiper-container middle">
                    <div class="swiper-wrapper">
						<% index[0].department.box.forEach(function(v){%>
                        <div class="swiper-slide">
                            <img class="slide-img" src="images/<%= v.img%>" alt="">
                            <h4><%= v.theme%></h4>
                            <p><%= v.cnt%></p>
                        </div>
						<% }) %>
                        <!-- <div class="swiper-slide"><img class="slide-img" src="images/slide2.png" alt="">
                            <h4>市场运营中心</h4>
                            <p>市场运营中心为小店创业者开设培训课程，帮助小店创业者掌握专业技能，提高经营能力。 </p>
                        </div>
                        <div class="swiper-slide"><img class="slide-img" src="images/slide3.png" alt="">
                            <h4>内控中心</h4>
                            <p>专业的法务团队、合规团队和财税团队，最大化保障消费者权益的同时，协助供应商提升合法经营竞争力，降低小店创业者经营风险。 </p>
                        </div>
                        <div class="swiper-slide"><img class="slide-img" src="images/shouye@2x.png" alt="">
                            <h4>组织中心</h4>
                            <p>承担人才培训考核、行政制度建设、对外联系协调等多重职责，是企业文化建设的核心。  </p>
                        </div>
                        <div class="swiper-slide"><img class="slide-img" src="images/yonghu@2x.png" alt="">
                            <h4>平台运营中心</h4>
                            <p>平台运营中心制作专业的“种草”、亲测类视频和图文，分担供应商的工作成本，减轻小店创业者的经营压力，提高购物者的购买体验。  </p>
                        </div> -->
                    </div>
                </div>
                <div id="prev" class="prev"><img src="images/icon_left.png" alt=""></div>
                <div id="next" class="next"><img src="images/icon_right.png" alt=""></div>
            </div>


        </div>
    </div>
</div>
<div class="main2">
    <div class="main2-top">
        <p class="top-title"><%= index[0].department.name%></p>
        <p class="top-desc"><%- index[0].department.intro%> </p>
    </div>
    <div class="main2-swiper">
        <!-- Swiper -->
        <div class="swiper2-container">
            <div class="swiper-wrapper">
				<% index[0].department.box.forEach(function(v){%>
                <div class="swiper-slide">
                    <img class="slide-img" src="images/<%= v.img%>" alt="">
                    <h4><%= v.theme%></h4>
                    <p><%= v.cnt%></p>
                </div>
				<% }) %>
                <!-- <div class="swiper-slide">
                    <img class="slide-img" src="images/slide2.png" alt="">
                    <h4>市场运营中心</h4>
                    <p>市场运营中心为小店创业者开设培训课程，帮助小店创业者掌握专业技能，提高经营能力。  </p>
                </div>
                <div class="swiper-slide">
                    <img class="slide-img" src="images/slide3.png" alt="">
                    <h4>内控中心</h4>
                    <p>专业的法务团队、合规团队和财税团队，最大化保障消费者权益的同时，协助供应商提升合法经营竞争力，降低小店创业者经营风险。  </p>
                </div>
                <div class="swiper-slide">
                    <img class="slide-img" src="images/slide4.png" alt="">
                    <h4>组织中心</h4>
                    <p>承担人才培训考核、行政制度建设、对外联系协调等多重职责，是企业文化建设的核心。  </p>
                </div>
                <div class="swiper-slide">
                    <img class="slide-img" src="images/slide5.png" alt="">
                    <h4>平台运营中心</h4>
                    <p>平台运营中心制作专业的“种草”、亲测类视频和图文，分担供应商的工作成本，减轻小店创业者的经营压力，提高购物者的购买体验。  </p>
                </div> -->
            </div>
        </div>
    </div>
</div>

<script>
    var swiper = new Swiper('.middle', {
        slidesPerView: 3,
        spaceBetween: 48,
        // centeredSlides: true,
        loop: false,

    });
    $('#prev').click(function () {
        swiper.slidePrev();
    })
    $('#next').click(function () {
        swiper.slideNext();
    })
    var swiper2 = new Swiper('.swiper2-container', {
        slidesPerView: 'auto',
        spaceBetween: 20,
        loop: false,
    });
</script>

<script language="javascript">
    var count = 1;
    if (count > 1) {
        var mySwiper = new Swiper('.pc', {
            autoplay: true,//可选选项，自动滑动
            loop: true,//无缝
            speed: 2000,
            pagination: {
                el: '.swiper-pagination'
            },
        })
        var mySwiperWeb = new Swiper('.web', {
            autoplay: true,//可选选项，自动滑动
            loop: true,//无缝
            speed: 2000,
            pagination: {
                el: '.swiper-pagination'
            },
        })
    }

</script>
<!-- 主要内容 结束 -->


    
<%- include('headfoot/footer.html') %>
    
    

</body>
<script>
    $('.navbar-toggler').on('click', function (e) {
        $('.masker').toggle();
    })
    $('.masker').on('click', function (e) {
        $(this).css('display', 'none');
        $('#navbarSupportedContent').toggleClass('show');
    })
</script>

</html>